<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./javascripts/tools.js"></script>
    <script>
        function init() {
            //获取当前 url中的type参数
            let cur_url = new URL(window.location.href);
            let type = cur_url.searchParams.get("type");
            let id = cur_url.searchParams.get("id")
            let form = document.getElementById("form");
            form.action = "/data/update?type=" + type + "&id=" + id
            let url = "/data/query?type=" + type + "&id=" + id;
            let xhr = new XMLHttpRequest();
            xhr.open("GET", url, true);
            xhr.send();
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4 && xhr.status == 200) {
                    let data = JSON.parse(xhr.responseText)[0];
                    document.getElementsByName("name")[0].value = data.name;
                    document.getElementsByName("description")[0].value = data.description;
                    document.getElementsByName("attributes")[0].value = data.attributes;
                    document.getElementsByName("text_icon")[0].value = data.icon;
                    document.getElementsByName("img")[0].src = data.icon;
                }
            }
        }
    </script>
</head>

<body onload="init()">
    <form id="form" method="post" enctype="multipart/form-data">
        名称：<input type="text" name="name" placeholder="name">
        描述：<textarea name="description"></textarea>
        属性：<textarea name="attributes"></textarea>
        图标：<img src="" alt="" name="img" width="45" height="45"><input type="file" name="icon" id="icon">
        <input type="text" name="text_icon" hidden>
        <button type="submit">提交</button>
    </form>
</body>

</html>